/*JAaK231nWxw37T1leoLMFXoM+oa5zbWLraQ6S1E2P6c=*/
import React from 'react'
import { base } from 'nc-lightapp-front';
import ParseLayoutComponet from 'lowcode-runtime/ParseLayout'
const { NCStep } = base;
const NCSteps = NCStep.NCSteps;
import layoutData from './layoutData.json'

const STEPS = [{
    title: '设置页面基本信息',
    desc: ''
}, {
    title: '配置模板区域',
    desc: ''
}, {
    title: '配置完成',
    desc: ''
}];

class BaseStep extends React.Component {
    constructor(props) {
        super(props);
        this.lastCurrent = props.current;
    }

    perceptionDesc = (current, index) => {

        let desc = '';
        if (current === index) {
            desc = '进行中';
        } else {
            desc = current > index ? '已完成' : '';
        }

        return desc;
    };
    UNSAFE_componentWillReceiveProps(nextProps) {
        console.log(11111, nextProps);
    }

    render() {
        const { current, onStepChange } = this.props;
        if (this.lastCurrent !== current && typeof onStepChange === "function") {
            onStepChange(current);
            this.lastCurrent = current;
        }
        return (
            <div className='step-container'>
                <NCSteps
                    current={current}
                >
                    {STEPS.map((item, index) => (
                        <NCStep
                            key={item.title}
                            title={item.title}
                            description={this.perceptionDesc(current, index)}
                        />
                    )
                    )}
                </NCSteps>
              
            </div>
        );
    }
}

export default BaseStep;
/*JAaK231nWxw37T1leoLMFXoM+oa5zbWLraQ6S1E2P6c=*/